﻿<!DOCTYPE html>
<html lang="zh">
<head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta name="renderer" content="webkit">
    <meta http-equiv="CurrData.Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <title>Index </title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />

    <link href="/js/kd/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="/js/kd/styles/kendo.blueopal.min.css" rel="stylesheet" />
    <link href="/js/fa/css/font-awesome.min.css" rel="stylesheet" />
    <link href="/js/site.css?t=20221031" rel="stylesheet" />

    <script src="/js/kd/jquery.min.js"></script>
    <script src="/js/kd/kendo.web.min.js"></script>

    <script src="/js/kd/cultures/kendo.culture.zh-CN.min.js"></script>
    <script src="/js/kd/messages/kendo.messages.zh-CN.min.js"></script>
    <script src="/js/kd/jszip.min.js"></script>


    <script src="/js/kendo_stdefine.js"></script>
    <script src="/js/site50.js"></script>
    <script src="/js/xlsx.full.min.js?t=1"></script>


</head>
<body>


    <div id="divSplitter" data-role="splitter"
         data-panes="[
                { collapsible: false, resizable: false,  size: '245px' },
                { collapsible: false, resizable: false }
             ]"
         style="">
        <div id="left-pane" style="overflow:hidden;overflow-y:auto;">
            <div id="toolbarCenter" style="height:40px;line-height:40px;margin-bottom:2px;border-bottom: 1px solid #23549C;background:#14346a;font-family:'Microsoft YaHei'" class="flexrow">
                <div style="flex:1;margin-left:14px;font-size:14px">
                    采集器
                </div>

                <div style="width:20px;color:#5999D4;">

                </div>

                <div style="width:20px;color:#5999D4;">

                </div>
                <div style="width:20px;color:#5999D4;">

                </div>

                <div style="width:20px;color:#5999D4;">

                </div>
                <div style="width:20px;color:#5999D4;">

                </div>




            </div>
            <div id="treeview"
                 data-role="treeview"
                 data-drag-and-drop="false"
                 data-text-field="text"
                 data-id-field="id"
                 data-spritecssclass-field="imageurl"
                 data-bind="source: treeData,
                    events: { change: treeNodeChange }"
                 style="flex-wrap: wrap;overflow-x:hidden;overflow-y:auto ;height:calc( 100% - 45px)">

            </div>

        </div>

        <div id="center" style="overflow: hidden;overflow-y:auto; ">
            <div id="grid" style="height: calc(100% -  5px)"></div>
        </div>


    </div>


    <script id="cmd-template" type="text/x-kendo-template">
               <div id="divTop" style="height:30px; padding:5px;  " class="flexrow">

                    <div style="width:60px;padding-top:5px;padding-right:10px;text-align:right;">
            <label style="">关键字</label>
        </div>

              <div style="width:200px;">
                  <input id="Key" Name="Key" class="k-textbox" placeholder="设备名称"/>
              </div>


                   <div style="width:20px;">
                   </div>

                     <div style="width:90px;">
                       <a style="width:80px;" onclick='Page();' class='k-button '><span class='k-icon k-i-search'></span>查询</a>
                   </div>

                   <div style="width:90px;text-align:right;">
                       <a class='k-button k-space-left k-grid-excel'><span class='k-icon k-i-excel'></span>导出</a>
                   </div>
                    <div style="flex:1;">
                    </div>
                    <div style="width:20px;">

                    </div>
               </div>
    </script>


    <script id="action-template" type="text/x-kendo-template">
        <a href="javascript:;" onclick="Cmd(#:DeviceCode#)" >操作</a>
    </script>
    <script>
        var viewModel = new kendo.data.ObservableObject({
            treeNodeChange: function (e) {
                var treeView = $("#treeview").data("kendoTreeView");
                var nodedata = treeView.dataItem(treeView.select());
                if (!nodedata) {

                }



                switch (nodedata.attrs2) {
                    case "A":


                        break;//第一级
                    case "B":
                        Page();
                        break;//第二级
                }

            },
            treeData: [],
        });
        var CurrData = {};
        var grid;
        function Init() {

            var opt = Object.assign({}, gridBaseOption);

            opt.columns = [

                { title: '序号', field: "RowNo", width: 50, sortable: false, filterable: false, },
                { title: '设备编号', field: "DeviceCode", width: 80, sortable: true, filterable: false, },
                { title: '设备名称', field: "DeviceName", width: 80, sortable: false, filterable: false, },
                { title: '属性号', field: "PropCode", width: 80, sortable: false, filterable: false, },
                { title: '属性名称', field: "PropName", width: 80, sortable: false, filterable: false, },
                { title: '值', field: "NumValue", width: 80, sortable: false, filterable: false, },
                { title: '状态', field: "StateValue", width: 80, sortable: false, filterable: false, },
                { title: '报警状态', field: "BJStatus", width: 80, sortable: false, filterable: false, },
                { title: '单位', field: "Unit", width: 80, sortable: false, filterable: false, },
                { title: '精读', field: "Scale", width: 80, sortable: false, filterable: false, },
                { title: '上限', field: "ValueHigh", width: 80, sortable: false, filterable: false, },
                { title: '下限', field: "ValueLow", width: 80, sortable: false, filterable: false, },
                {
                    title: '操作', field: "", width: 80, sortable: false, filterable: false,
                   template: kendo.template($("#action-template").html())
                 },
            ]
            opt.pageable = $.extend(true, {}, KDGridpageable)
            opt.toolbar = kendo.template($("#cmd-template").html());

            grid = $("#grid").kendoGrid(opt).data("kendoGrid");
            kendo.bind($("#divSplitter"), viewModel);


            GetTree("");

        }
        function Page() {
            var treeView = $("#treeview").data("kendoTreeView");
            var nodedata = treeView.dataItem(treeView.select());


            var dataSource = newDataSource({
                jq: $("#grid"),
                url: "/api/ProtocolSimHost/DataPage",
                getParam: function (data) {
                    var treeView = $("#treeview").data("kendoTreeView");
                    var nodedata = treeView.dataItem(treeView.select());

                    if (nodedata.attrs2 == "A") {

                        data.ProtocolSimHostId = nodedata.id;
                    } else {
                        data.ProtocolSimHostId = nodedata.id;
                    }
                    data.Key = $("#Key").val();

                },
                pageSize: 20,
                page: 1,
            })


            grid.setDataSource(dataSource);
            dataSource.read();
        }
        function GetTree(selid) {

            var tv = $("#treeview").data("kendoTreeView");

            myAjax({
                url: "/api/ProtocolSim/Tree",
                success: function (r) {

                    var ohy = kendo.observableHierarchy({
                        data: r.Data
                    });

                    viewModel.set("treeData", ohy);

                    if (selid) {

                        var di = tv.dataSource.get(selid);
                        var bar = tv.findByUid(di.uid);
                        tv.select(bar);
                    } else if (r.Data.length > 0) {
                        var data = tv.dataSource.data();
                        var item = data[0]; 
                        if (item.items.length > 0) {
                            item = item.items[0];
                        } 
                        var bar = tv.findByUid(item.uid);
                        tv.select(bar);
                    }

                }
            });
        };
        function Cmd(dcode) {
            var treeView = $("#treeview").data("kendoTreeView");
            var nodedata = treeView.dataItem(treeView.select());
            if (!nodedata) {
                return;
            }
            myAjax({
                url: "/api/ProtocolSimHost/ListCmd",
                data: { Id: nodedata.id},
                success: function (r) {
                    var CmdDs = r.Data;
                    CmdShow({
                        m: {
                            Id: "0",
                            ProtocolSimHostId: nodedata.id,
                            DeviceCode: dcode,
                            "Cmd": "",

                        },
                        CmdDs
                    });
                }
            })
        }
        function CmdShow(data) {
            var opt = myGetTop().GetFullWH();
            var w = Math.min(opt.w - 100, 400);
            var h = Math.min(opt.h - 100, 200);
            var url = "/ProtocolSimHost/Cmd.html?t=" + Math.random();
            myWindowOpen({
                title: "操作"
                , url: url
                , width: w
                , height: h
                , isMaxH: false
                , onload: function (win) {
                    win.IsAdd = false;
                    win.setData(data);

                    win.onOk = function (m) {
                        CmdShowSave(m);
                    }
                    myFocus(win);
                }
                , onclosed: function (win) {
                }
                , success: function (m) {
                }
            });
        }
        function CmdShowSave(m) {
           
            myAjax({
                url: "/api/ProtocolSimHost/Cmd",
                data: m,
                success: function (r) {
                    myAlert(r.Message);
                }
            })
        }

    </script>

    <script>
        var SizeInfo;
        $(function () {

            kendo.culture("zh-CN");


            if (window.Init) {
                Init();
            }
        });
        function After50(d) {
            if (d) {
                setTimeout(function () { d(); }, 50);
            }
        }
    </script>
</body>
</html>
